@charset 'utf-8';
@import "public/_config.scss";
body{
	background-color: #f0f0f0;
}
.swiper{
	.swiper-slide{
		width: 100%;
		height: pxToRem(360);
		@include set-bg-img( $name: "icon-swiper.png", $size: 100% auto, $position: center center);
	}
}
.box{
	@include flex-box();
	background-color: #fff;
	.item{
		@include flex-item();
		text-align: center;
		padding: pxToRem(20) 0 pxToRem(15);
		.photo{
		margin: 0 auto;
			width: pxToRem(64);
			height: pxToRem(64);
			@include set-bg-img( $name: "icon-act.png", $size: auto pxToRem(64), $position: center center);
			&.act{
				@include set-bg-img( $name: "icon-act.png", $size: auto pxToRem(64), $position: center center);
			}
			&.vote{
				@include set-bg-img( $name: "icon-vote.png", $size: auto pxToRem(64), $position: center center);
			}
			&.questionnaire{
				@include set-bg-img( $name: "icon-questionnaire.png", $size: auto pxToRem(64), $position: center center);
			}
			&.notice{
				@include set-bg-img( $name: "icon-notice.png", $size: auto pxToRem(64), $position: center center);
			}
			&.declare{
				@include set-bg-img( $name: "icon-declare.png", $size: auto pxToRem(64), $position: center center);
			}
		}
		.dis{
			font-size: pxToRem(24);
			color: #343434;
			padding-top: pxToRem(15);
		}
	}
}
.new{
	/*margin-top: pxToRem(20);*/
	background-color: #fff;
	.title{
		@include flex-box();
		padding: pxToRem(34) pxToRem(20) 0;
		margin-left: pxToRem(-20);
		.til{
			@include flex-box();
			@include flex-item();
			font-size: pxToRem(36);
			color: #000;
			font-weight:700;
			&::before{
				content: '';
				display: inline-block;
				width: pxToRem(10);
				height: pxToRem(33);
				background-color: #3dbbb2;
				margin-right: pxToRem(9);
				@include prefixCss3($property: align-self, $value: center);		
			};
		}
		.more{
			display: inline-block;
			font-size: pxToRem(28);
			color: #909090;
			@include prefixCss3($property: align-self, $value: center);
		}
	}
	.item-act{
		@include flex-box();
		margin: 0 pxToRem(20);
		padding: pxToRem(37) 0;
		@include border-bottom-m;
		&::after{
		    border-color: #d5d5d5;
		};
		&:last-of-type{
			&::after{
		        border: none;
		    }; 
		};
		
	}
	.item-vote{
		@include flex-box();
		margin: 0 pxToRem(20);
		padding: pxToRem(37) 0;
		@include border-bottom-m;
		&::after{
		    border-color: #d5d5d5;
		};
	}
	.questionnaire-vote{
		@include flex-box();
		margin: 0 pxToRem(20);
		padding: pxToRem(37) 0;
	}
	.con{
		border-bottom: pxToRem(10) solid #f0f0f0;
		/*margin: 0 pxToRem(-20);*/
	}
		.act-photo{
			width: pxToRem(160);
			height: pxToRem(135);
			margin-right: pxToRem(24);
			@include set-bg-img( $name: "icon-placehold.png", $size: pxToRem(159) auto, $position: right center);
			border: 1px solid #efefef;
			&.questionnaire-photo{
				height: pxToRem(150);
				@include set-bg-img( $name: "icon-placehold2.png", $size: pxToRem(159) auto, $position: right center);
			}
		}
		.act-message{
			@include flex-item();
			.act-title{
				@include flex-box();
				padding-top: pxToRem(7);
				padding-bottom: pxToRem(20);
				.name{
					@include flex-item();
					color: #000;
					font-size: pxToRem(30);
					@include text-overflow(1);
				}
				.blod{
					font-weight:600;
				}
				.time{
					font-size: pxToRem(22);
					color: #686868;
					padding-left: pxToRem(5);
					/*@include prefixCss3($property: align-self, $value: center);*/
					margin-top: pxToRem(6);
				}
				&.bottom-height{
					padding-bottom: pxToRem(7);
				}
			}
			.questionnaire-message{
				@include flex-box();
				padding-top: pxToRem(10);
				font-size: pxToRem(22);
				color: #b4b4b4;
				.ques{
					@include flex-item();
					span{
						margin-right: pxToRem(20);
					}
					.eye{
						font-size: pxToRem(22);
						padding-left: pxToRem(35);
						@include set-bg-img( $name: "icon-eye.png", $size: pxToRem(30) auto, $position: left center);
					}
					.heart{
						font-size: pxToRem(22);
						padding-left: pxToRem(25);
						@include set-bg-img( $name: "icon-heart.png", $size: pxToRem(20) auto, $position: left center);
					}
				}
				.questionnaire-time{
					font-size: pxToRem(22);
				}
			}
		}
			
		.act-mess{
			font-size: pxToRem(26);
			color: #686868;
			line-height: pxToRem(37);
			@include text-overflow(2);
		}
		
	.vote-box{
		@include flex-box();
		padding: 0  pxToRem(20);
		.vote-item{
			@include flex-item();
			font-size: pxToRem(24);
			color: #686868;
			line-height: pxToRem(60);
			&.center{
				text-align: center;
			}
			&.right{
				text-align: right;
			}
		}
	}
		
}